<template>
  <t-dialog  :header="`${row.localStandard.projectName}-审批`" :visible.sync="visible" :onClose="closeDialog"
    :closeOnOverlayClick="false" :confirmBtn="null"  mode="full-screen" top="5%">
    <div style="height: 80vh;">
      <standard-detail v-if="row.approveType==='1'" :reviewOpen="true" :objId="row.localStandard.id"></standard-detail>
      <standard-bs-detail v-else-if="row.approveType==='2'" :reviewOpen="true" :objId="row.localStandard.id"></standard-bs-detail>
      <register-detail v-else-if="row.approveType==='3'" :reviewOpen="true" :objId="row.localStandard.id"></register-detail>
      <t-drawer
        :visible.sync="drawerVisible"
        showInAttachedElement
        :showOverlay="false"
        size="27%"
        :preventScrollThrough="false"
        header="评审内容"
      >
        <t-form label-align="top" :disabled="!reviewOpen" ref="form" :data="formData" :rules="rules">
          <t-form-item label="审批业务类型" name="approveType">
            <t-select disabled v-model="formData.approveType" clearable
                      :options="dict.type.bzh_approve_type">
            </t-select>
          </t-form-item>

          <t-form-item v-if="formData.approveStatus === '3'"  label="审批意见">
            <template slot="label">
                审批意见  <t-link v-if="reviewOpen" @click="dialog.open_approval_opinions_list =true" style="margin-left:10px"  hover="color" theme="primary">选择常用审批意见</t-link>
               </template>
            <t-textarea :autosize="{minRows: 5}"
                        v-model="formData.opinion"  placeholder="请输入内容"/>
          </t-form-item>
          <t-form-item v-else name="opinion" label="审批意见">
            <template slot="label">
                审批意见  <t-link v-if="reviewOpen" @click="dialog.open_approval_opinions_list =true" style="margin-left:10px"  hover="color" theme="primary">选择常用审批意见</t-link>
               </template>
            <t-textarea  :autosize="{minRows: 5}"
                        v-model="formData.opinion"  placeholder="请输入内容"/>
          </t-form-item>

          <t-form-item label="审批结果" name="approveStatus">
            <t-radio-group  v-model="formData.approveStatus">
              <t-radio value="3" label="通过"></t-radio>
              <t-radio value="4" label="退回"></t-radio>
            </t-radio-group>
          </t-form-item>
        </t-form>
        <template  #footer>
          <t-button  theme="default" @click="closeDrawer">关闭审批界面</t-button>
          <t-button v-if="reviewOpen" theme="primary" @click="onSubmit()">提交审批</t-button>
        </template>
      </t-drawer>
    </div>
    <template #footer>
      <t-button theme="default" @click="closeDialog">取消</t-button>
<!--      <t-button  theme="default" variant="outline" @click="drawerApproveVisible = true">审批记录</t-button>-->
      <t-button theme="primary"  @click="drawerVisible = true">打开审批界面</t-button>
    </template>
    <approval-opinions-list-dialog v-if="dialog.open_approval_opinions_list" :visible.sync="dialog.open_approval_opinions_list" @selectContent="formData.opinion = $event"></approval-opinions-list-dialog>
  </t-dialog>
</template>

<script>
import standardDetail from "@/pages/bzh/standard/components/standard-detail.vue";
import standardBsDetail from "@/pages/bzh/standard/components/standard-bs-detail.vue";
import registerDetail from "../../register/components/register-detail.vue";
import ApprovalOpinionsListDialog from "@/pages/components/approval-opinions-list-dialog.vue"


export default {
  dicts:["bzh_approve_type"],
  name: "approve-info",
  components: {
    standardDetail,
    standardBsDetail,
    registerDetail,
    ApprovalOpinionsListDialog
  },
  props: {
    row: Object,
    reviewOpen:{
      type: Boolean,
      default: true
    },
  },
  data() {
    return {
      visible: true,
      rules: {
        opinion: [
          {required: true, message: "审批意见不能为空"}
        ],
        approveStatus: [
          {required: true, message: "审批结果不能为空"}
        ],
      },
      formData:{
        id: this.row.id,
        businessId: this.row.businessId,
        approveType: this.row.approveType,
        opinion:"",
        approveStatus: "3",
      },
      drawerVisible:false,
      tabValue:"1",
      dialog:{
        open_approval_opinions_list:false
      },
    }
  },
  created() {
    this.row.approveStatus = this.row.approveStatus || '3';
    Object.assign(this.formData, this.row);
  },
  methods: {
    onSubmit() {
      this.$refs.form.validate().then((validateResult) => {
        if (validateResult === true) {
          let loading = false;
          const confirmDia = this.$dialog.confirm({
            header: "审批提示",
            body: `是否确认提交？`,
            // confirmBtn:{
            //   content: loading?'提交中...':'提交',
            //   theme: 'primary',
            //   loading,
            // },
            theme: "warning",
            onConfirm: ({e}) => {
              this.formData.localStandardStatus = this.formData.approveStatus
              if(this.formData.approveStatus ==="3" && !this.formData.opinion){
                this.formData.opinion = "通过"
              }
              confirmDia.update({
                confirmBtn: {
                  loading: true,
                },
              })
              this.$api.bzh.approve.opApprove(this.formData).then(response => {
                this.$message.success('提交成功');
                this.$emit("reload");
                this.$emit("update:visible", false);
                confirmDia.destroy();
                loading = false
              }).catch((e) => {
                loading = false
                confirmDia.update({
                  confirmBtn: {
                    loading: false,
                  },
                })
                this.$message.error(e.toString());
              });
            },
          })

        }else {
          const firstError = Object.values(validateResult)[0]?.[0]?.message;
          this.$message.error(firstError);
        }
      })
    },
    closeDrawer(){
      this.drawerVisible = false
    },
    closeDialog() {
      this.$emit("update:visible", false);
    },
  }
}
</script>


<style lang="less" scoped>
.t-tab-panel {
  padding: 10px;
}

.t-form__item {
  margin-bottom: 6px
}

.t-row {
  margin-bottom: 14px;
}

.step-card {
  height: 100%;
  margin-bottom: 14px;
}

::-webkit-scrollbar {
  width: 8px;
  background: transparent;
}

::-webkit-scrollbar-thumb {
  border-radius: 6px;
  border: 2px solid transparent;
  background-clip: content-box;
  background-color: var(--td-scrollbar-color);
}
/deep/ .t-drawer .t-drawer__content-wrapper{
  height: calc(100% - var(--td-comp-size-xxxl));
  margin-top: var(--td-comp-size-xxxl);
}
/deep/ .t-drawer__header{
  display: none;
}
</style>
